<template>
  <div>
    <div>
      <!--第一行:显示已选奖项-->
      <el-row>
        <el-col :span="24">
          <div class="grid-content bg-purple-dark">
            已选奖项：
            <span>
              <!--              <el-dropdown @command="handleCommand">-->
              <!--                &lt;!&ndash;<el-button size="medium" split-button type="primary" round>&ndash;&gt;-->
              <!--                <el-button size="medium" split-button type="primary">-->
              <!--                  SCI论文<i class="el-icon-arrow-down el-icon&#45;&#45;right" />-->
              <!--                </el-button>-->
              <!--                <el-dropdown-menu slot="dropdown">-->
              <!--                  <el-dropdown-item command="a">SCI论文</el-dropdown-item>-->
              <!--                  <el-dropdown-item command="b">EI论文</el-dropdown-item>-->
              <!--                  <el-dropdown-item command="c">中文核心期刊</el-dropdown-item>-->
              <!--                  <el-dropdown-item command="d" disabled>其他</el-dropdown-item>-->
              <!--                  <el-dropdown-item command="e" divided>会议论文</el-dropdown-item>-->
              <!--                </el-dropdown-menu>-->
              <!--              </el-dropdown>-->
              <el-button size="medium" split-button type="primary">奖项1</el-button>
            </span>
            <!--            <span id="span1">-->
            <!--              <a href="http://localhost:9527/#/student/comment">未找到？请留言</a>-->
            <!--            </span>-->
          </div>
        </el-col>
      </el-row>
      <!--第二行：显示奖项信息和个人信息-->
      <el-row :gutter="20">
        <!--奖项信息-->
        <el-col :span="12">
          <div class="table-prize">
            <el-table
              class="prize-info"
              :data="tableData"
              style="width: 100%; border-radius: 20px"
            >
              <el-table-column
                prop="type"
                label="类型"
                width="180"
              />
              <el-table-column
                prop="info"
                label="信息"
              />
              <!--              <el-table-column-->
              <!--                prop="address"-->
              <!--                label="地址">-->
              <!--              </el-table-column>-->
            </el-table>
          </div>
        </el-col>
        <!--个人信息-->
        <el-col :span="12">
          <div class="table-user">
            <span>
              <div v-for="fit in fits" :key="fit" class="block">
                <!--                <span class="demonstration">{{ fit }}</span>-->
                <el-image
                  style="width: 150px; height: 150px"
                  :src="url"
                  :fit="fit"
                />
              </div>
              <!--              <img src="file:///C:/Users/Jugg/FEBS-Cloud-Web/src/views/award_StuUser/%E8%AF%84%E5%A5%96%E8%AF%84%E4%BC%98/%E6%96%B0%E5%A2%9E%E5%8F%AF%E7%94%B3%E8%AF%B7/xxx.png" alt="用户头像">-->
            </span>
            <span class="user-info">
              <div>
                姓名：XXX
                <br>
                学号：202100X
                <br>
                2020级 | 计算机 |硕士生
              </div>
            </span>
          </div>
        </el-col>
      </el-row>
      <!--第三行：是否可申请-->
      <el-row>
        <el-col>
          <div class="check">
            经核查，该生不符合该奖项的基本要求。
            <br>
            具体信息如下：
            <br>
            1.XXX
            <br>
            2.XXX
          </div>
        </el-col>
      </el-row>
      <!--第四行：确认/申诉-->
      <el-row>
        <el-col>
          <div class="action">
            <a href="http://localhost:9527/#/prize/myapply"><el-button type="primary" class="but1" command="a">确定</el-button></a>
            <el-button type="danger" class="but2" command="b">申诉</el-button>
          </div>
        </el-col>
      </el-row>
    </div>
  </div>
</template>

<script>
export default {
  name: 'Index',
  data() {
    return {
      tableData: [{
        type: '奖项名称',
        info: '奖项1'
      }, {
        type: '发布时间',
        info: '2021-04-30'
      }, {
        type: '活动状态',
        info: '进行中'
      }, {
        type: '是否公示',
        info: '未公示'
      }],
      fits: ['contain'],
      url: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg'
    }
  }
}

</script>

<style scoped>
@import "SelectType.scss";
</style>
